<template>
  <el-container>
    <el-aside width="auto"><AsideComponent/></el-aside>
    <el-container>
      <el-header><HeaderComponent/></el-header>
      <el-main><router-view/></el-main>
      <el-footer height="40px"><FooterComponent/></el-footer>
    </el-container>
  </el-container>
</template>

<script>
import HeaderComponent from "@/components/HeaderComponent";
import AsideComponent from "@/components/AsideComponent";
import FooterComponent from "@/components/FooterComponent";

export default {
  name: "Main",
  components:{
    HeaderComponent,
    AsideComponent,
    FooterComponent
  }
}
</script>

<style scoped>
  .el-container{
    height: 100%;
  }
  .el-header{
    padding: 0px;
  }
  .el-main{
    padding: 0px;
  }
  .el-footer{
    padding: 0px;
  }




</style>
